<template>
  <div class="page-container">
    <div class="common-content-wrap">
      <TrTable
        ref="trTable"
        requestName="searchHandle"
        isNeedSelection
        isNeedIndex
        v-model="searchParams"
        :btnList="btnList"
        :total="totalNum"
        :searchShowList="searchShowList"
        :searchHideList="searchHideList"
        :minSearchLabelWidth="102"
        :tableColumn="tableColumn"
        :tableData="tableData"
        @audit="operateHandle($event, 'audit')"
        @export="operateHandle($event, 'export')"
        @view="operateHandle($event, 'view')"
        @rowAudit="operateHandle($event, 'rowAudit')"
      />
    </div>
    <TrDetail
      v-model="optionInfo.isShowPopup"
      :popupTitle="optionInfo.detailLabel"
      :leftList="optionInfo.detailList"
      statusModel="hidden"
      :width="1227"
      :labelWidth="86"
      :detailData="optionInfo.detailData"
      :isNeedFooter="false"
      @close="closeDetaililHandle"
    >
      <template #bomTable>
        <TrTable
          isPopup
          isNeedIndex
          v-model="optionInfo.detailSearchParams"
          :isNeedPagination="optionInfo.isNeedPagination"
          :tableData="optionInfo.detailTableData"
          :total="optionInfo.detailTotal"
          :tableColumn="optionInfo.detailTableColumn"
          requestName="getBomListHandle"
          @viewDeatil="optionDeatilInner($event)"
        />
        <TrDetail
          v-model="optionInfo.isShowInnerPopup"
          :popupTitle="optionInfo.detailInnerLabel"
          :leftList="optionInfo.detailInnerList"
          statusModel="hidden"
          :width="1227"
          :isNeedFooter="false"
          :detailData="optionInfo.detailInnerData"
          @close="closeDetailInnerPopup"
        >
          <template #bomTable>
            <TrTable
              isPopup
              isNeedIndex
              :isNeedPagination="optionInfo.isNeedInnerPagination"
              :tableData="optionInfo.innerTableData"
              :total="optionInfo.innerTotal"
              :tableColumn="optionInfo.innerTableColumn"
              requestName="getBomListHandle"
              @view="optionDeatilInnerDeatil($event)"
            />
          </template>
        </TrDetail>
      </template>
    </TrDetail>
    <TrDetail
      v-model="optionInfo.isShowInnerDetailPopup"
      :popupTitle="optionInfo.detailInnerDeatilLabel"
      :leftList="optionInfo.detailInnerDetailList"
      statusModel="hidden"
      :width="1227"
      :labelWidth="102"
      :detailData="optionInfo.detailInnerDetailData"
      :isNeedFooter="false"
      @close="closeInnerDetailPopup"
    >
      <template #bomTable>
        <TrTable
          isPopup
          isNeedIndex
          :isNeedPagination="true"
          :tableData="optionInfo.innerDetailTableData"
          :total="optionInfo.innerDetailTotal"
          :tableColumn="optionInfo.innerDetailTableColumn"
          requestName="getBomListHandle"
        /> </template
    ></TrDetail>
  </div>
</template>

<script>
import {
  getList,
  getEnum,
  audit,
  getOutboundDetail,
  getOutboundDetailTable,
  getPickingDetail,
  getPickingDetailTable,
  getSendDetail,
  getSendDetailTable,
  getSendContainerDeatil,
} from "@/api/logistics/outboundAudit";
import { getColor } from "@/utils/billColor";
import { getObject } from "./js/outboundAudit";
import TrTable from "@/components/Tr-table/Tr-table.vue";
import TrDetail from "@/components/Tr-detail/Tr-detail.vue";

export default {
  components: {
    TrTable,
    TrDetail,
  },
  data: () => ({
    tableColumn: [
      {
        type: "text",
        label: "出库单据",
        value: "billCode",
      },
      {
        type: "text",
        label: "审核状态",
        value: "auditStateName",
      },
      {
        type: "text",
        label: "单据状态",
        value: "stateName",
      },
      {
        type: "text",
        label: "仓库业务类型",
        value: "whBizTypeName",
      },
      {
        type: "text",
        label: "创建人员",
        value: "createUserName",
      },
      {
        type: "text",
        label: "创建时间",
        value: "createTime",
      },
      {
        type: "text",
        label: "审核人员",
        value: "confirmUserName",
      },
      {
        type: "text",
        label: "审核时间",
        value: "confirmTime",
      },
      {
        type: "option",
        label: "操作",
        fixed: "right",
        width: 120,
        showBtnList: [
          {
            label: "查看",
            option: "view",
          },
          {
            label: "审核",
            option: "rowAudit",
          },
        ],
      },
    ],
    searchHideList: [
      {
        id: "whBizTypeCode",
        type: "select",
        width: 33.33,
        label: "仓库业务类型",
        value: "",
        list: [],
      },
      {
        id: "billCode",
        type: "input",
        width: 33.33,
        label: "出库单据",
        value: "",
      },
      {
        id: "createUserName",
        type: "input",
        width: 33.33,
        label: "创建人员",
        value: "",
      },
      {
        id: "confirmUserName",
        type: "loadselect",
        width: 33.33,
        label: "审核人员",
        value: "",
        list: [],
        requestObj: {
          url: "/api/trio-system/user/mes/page",
          method: "post",
          searchKey: "account",
          rlLabel: "username",
          rlValue: "username",
          resultKey: "data,data,records",
        },
      },
      {
        id: "auditStateList",
        type: "multiSelect",
        width: 33.33,
        label: "审核状态",
        list: [
          {
            label: "待审核",
            value: "1,3",
          },
          {
            label: "已审核",
            value: "2",
          },
        ],
        value: [],
      },
      {
        id: "stateList",
        type: "multiSelect",
        width: 33.33,
        label: "单据状态",
        list: [],
        value: [],
      },

      {
        startStr: "confirmTimeStart",
        endStr: "confirmTimeEnd",
        id: "confirmTime",
        type: "daterange",
        width: 80,
        label: "审核时间",
        value: [],
        timePeriod: true,
        radio: -1,
      },
    ],
    searchShowList: [
      {
        isNeed: true,
        startStr: "createTimeStart",
        endStr: "createTimeEnd",
        id: "createdTime",
        type: "daterange",
        width: 80,
        label: "创建时间",
        value: [],
        timePeriod: true,
        radio: 1,
      },
    ],
    btnList: [
      {
        label: "审核",
        option: "audit",
        color: "blue",
        isRelaTable: true,
      },
      {
        label: "导出",
        option: "export",
        color: "white",
      },
    ],
    tableData: [],
    printList: [],
    searchParams: {
      current: 1,
      size: 10,
    },
    totalNum: 0,
    currentDetailHandle: 1,
    optionInfo: {},
  }),
  computed: {
    ids() {
      let ids = [];
      this.$refs.trTable.selectionList.forEach((ele) => {
        ids.push(ele.id);
      });
      return ids;
    },
  },
  mounted() {
    this.getEnmuData();
    // this.getListHandle();
  },
  methods: {
    getEnmuData() {
      const promises = [
        getEnum(["OutAuditBillStateEnum"]),
        getEnum(["BizBillWarehouseBusinessTypeEnum"]),
        getEnum(["OutAuditAuditStateEnum"]),
      ];
      Promise.all(promises).then(
        ([OutAuditBillRes, BizBillRes, OutAuditRes]) => {
          console.log(OutAuditBillRes, BizBillRes, OutAuditRes);
          //单据状态
          let state = this.$findByProperty(
            this.searchHideList,
            "id",
            "stateList"
          );
          this.$set(state, "list", OutAuditBillRes.data.data[0].list);
          //审核状态
          let auditState = this.$findByProperty(
            this.searchHideList,
            "id",
            "auditStateList"
          );
          this.$set(auditState, "list", OutAuditRes.data.data[0].list);
          //仓库业务类型
          let warehouseState = this.$findByProperty(
            this.searchHideList,
            "id",
            "whBizTypeCode"
          );
          this.$set(warehouseState, "list", BizBillRes.data.data[0].list);
        }
      );
    },
    async operateHandle(val, type) {
      console.log(val);
      this.currentDetailHandle = val.whBizTypeCode;

      this.$validateData(val, 3);

      const actions = {
        audit: () => this.auditHandle(this.ids),
        export: () =>
          this.$exportHandle({ vm: this, params: this.searchParams }),
        rowAudit: () => this.auditHandle([val.id]),
        view: () => this.optionDetailHandle(val),
      };

      const action = actions[type];
      if (action) action();
    },
    async optionDetailHandle(val) {
      this.optionInfo = getObject(this.currentDetailHandle);
      await this[`get${this.optionInfo.name}Handle`](val);
      this.optionInfo.isShowPopup = true;
    },
    async optionDeatilInner(val) {
      await this[`get${this.optionInfo.name}InnerHandle`](val);
      this.optionInfo.isShowInnerPopup = true;
    },
    async optionDeatilInnerDeatil(val) {
      await this[`view${this.optionInfo.name}InnerDeatil`](val);
      this.optionInfo.isShowInnerDetailPopup = true;
    },
    //杂项出库单详情
    async getOutboundHandle(val) {
      const { data } = await getOutboundDetail({
        id: val.id,
        current: 1,
        size: 30,
      });
      if (data.code !== 200) return;
      this.$validateData(data.data);

      this.optionInfo.detailData = {
        ...data.data,
        ...val,
      };
      const col = this.$findByProperty(
        this.optionInfo.detailList,
        "id",
        "stateName",
        "list"
      );
      col.valueColor = getColor("CKSH", val.state);
      const col1 = this.$findByProperty(
        this.optionInfo.detailList,
        "id",
        "auditStateName",
        "list"
      );
      col1.valueColor =
        {
          待审核: "#ED7B2F",
          已审核: "#00A870",
        }[val.auditStateName] || "";
      this.optionInfo.detailTableData = data.data.bizDetailDetailList.records;
      this.optionInfo.detailTableData.forEach((item) => {
        item.newNumUnit = `${item.numUnitCode}(${item.numUnitName})`;
        item.newWeightUnit = `${item.weightUnitCode}(${item.weightUnitName})`;
      });
      this.optionInfo.isShowPopup = true;
    },
    //杂项出库单详情明细
    async getOutboundInnerHandle(val) {
      const { data } = await getOutboundDetailTable({
        detailId: val.detailId,
        current: 1,
        size: 30,
      });

      if (data.code !== 200) return;
      this.$validateData(data.data);
      this.optionInfo.detailInnerData = val;
      this.optionInfo.innerTableData = data.data.records;
      this.optionInfo.innerTableData.forEach((item) => {
        item["stateNameColor"] = getColor("CKSH", item.state);
        item.newNumUnit = `${item.numUnit}(${item.numUnitName})`;
        item.newWeightUnit = `${item.weightUnit}(${item.weightUnitName})`;
      });
      this.innerTotal = Number(data.data.total);
    },
    //生产领料详情
    async getPickingHandle(val) {
      const { data } = await getPickingDetail({
        bizBillId: val.id,
        current: 1,
        size: 30,
      });
      if (data.code !== 200) return;

      this.$validateData(data.data);

      this.optionInfo.detailData = {
        ...data.data,
        stateName: val.stateName,
        auditStateName: val.auditStateName,
        createUserName: val.createUserName,
        createTime: val.createTime,
      };
      const col = this.$findByProperty(
        this.optionInfo.detailList,
        "id",
        "stateName",
        "list"
      );
      col.valueColor = getColor("CKSH", val.state);
      const col1 = this.$findByProperty(
        this.optionInfo.detailList,
        "id",
        "auditStateName",
        "list"
      );
      col1.valueColor =
        {
          待审核: "#ED7B2F",
          已审核: "#00A870",
        }[val.auditStateName] || "";
      this.optionInfo.detailTableData = data.data.bizDetailDetailList;
      this.optionInfo.detailTableData.forEach((item) => {
        item.newNumUnit = `${item.numUnitCode}(${item.numUnitName})`;
        item.newWeightUnit = `${item.weightUnitCode}(${item.weightUnitName})`;
      });
    },
    //生产领料详情明细
    async getPickingInnerHandle(val) {
      console.log(val);
      const { data } = await getPickingDetailTable({
        bizDetailId: val.bizDetailId,
        current: 1,
        size: 30,
      });

      if (data.code !== 200) return;

      this.$validateData(data.data);
      this.optionInfo.detailInnerData = {
        ...data.data,
        newNumUnit: `${data.data.numUnitCode}(${data.data.numUnitName})`,
        newWeightUnit: `${data.data.weightUnitCode}(${data.data.weightUnitName})`,
      };
      this.optionInfo.innerTableData = data.data.billBarcodePageList.records;
      this.optionInfo.innerTotal = Number(data.data.total);
      this.optionInfo.innerTableData.forEach((item) => {
        item.newNumUnit = `${item.numUnitCode}(${item.numUnitName})`;
        item.newWeightUnit = `${item.weightUnitCode}(${item.weightUnitName})`;
      });
    },
    //成品发货详情
    async getSendHandle(val) {
      const { data } = await getSendDetail({
        id: val.id,
        current: 1,
        size: 30,
      });
      if (data.code !== 200) return;
      console.log(data);
      this.$validateData(data.data);
      this.optionInfo.detailData = {
        ...data.data,
        ...val,
      };
      const col = this.$findByProperty(
        this.optionInfo.detailList,
        "id",
        "stateName",
        "list"
      );
      col.valueColor = getColor("CKSH", val.state);
      const col1 = this.$findByProperty(
        this.optionInfo.detailList,
        "id",
        "auditStateName",
        "list"
      );
      col1.valueColor =
        {
          待审核: "#ED7B2F",
          已审核: "#00A870",
        }[val.auditStateName] || "";
      this.optionInfo.detailTableData = data.data.shipmentInfoList;
      this.optionInfo.detailTableData.forEach((item) => {
        item.newNumUnit = `${item.numUnitCode}(${item.numUnitName})`;
        item.newWeightUnit = `${item.weightUnitCode}(${item.weightUnitName})`;
      });
    },
    //成品发货详情明细
    async getSendInnerHandle(val) {
      console.log(val);
      const { data } = await getSendDetailTable({
        detailId: val.bizDetailId,
        current: 1,
        size: 30,
      });

      if (data.code !== 200) return;

      this.$validateData(data.data);
      this.optionInfo.detailInnerData = {
        ...val,
      };

      this.optionInfo.innerTableData = data.data.records;
      this.optionInfo.innerTableData.forEach((item) => {
        item.newNumUnit = `${item.numUnitCode}(${item.numUnitName})`;
        item.newWeightUnit = `${item.weightUnitCode}(${item.weightUnitName})`;
      });
      this.optionInfo.innerTotal = Number(data.data.total);
    },
    //成品发货明细容器
    async viewSendInnerDeatil(val) {
      console.log(val);
      const { data } = await getSendContainerDeatil({
        packageCode: val.barcode,
        current: 1,
        size: 30,
      });

      if (data.code !== 200) return;
      this.$validateData(data.data);

      this.optionInfo.innerDetailTableData = data.data.records.map((item) => {
        return {
          ...item,
          newNumUnit: `${item.numUnitCode}(${item.numUnitName})`,
          newWeightUnit: `${item.weightUnitCode}(${item.weightUnitName})`,
        };
      });
      this.optionInfo.innerDetailTotal = Number(data.data.total);
    },
    closeDetaililHandle() {
      this.optionInfo.isShowPopup = false;
    },
    closeDetailInnerPopup() {
      this.optionInfo.isShowInnerPopup = false;
    },
    closeInnerDetailPopup() {
      this.optionInfo.isShowInnerDetailPopup = false;
    },
    async auditHandle(ids) {
      await this.$textShow({
        title: "审核",
        content: [this.$t("tip.audit")],
      });
      const { data } = await audit({ ids });
      if (data.code !== 200) return;
      this.$message.success(this.$t("msg.success"));
      this.searchParams.current = 1;
      this.$refs.trTable.clearSelect();
      this.getListHandle();
    },
    searchHandle() {
      this.getListHandle();
    },
    async getListHandle() {
      const { data } = await getList(this.searchParams);
      console.log(data);
      if (data.code != 200) return;

      this.$validateData(data.data);
      this.tableData = data.data.records;
      this.totalNum = Number(data.data.total);
      this.tableData.forEach((item) => {
        item["stateNameColor"] = getColor("CKSH", item.state);
        item["isShowrowAudit"] = item.auditStateName == "已审核";
        item["auditStateNameColor"] =
          {
            待审核: "#ED7B2F",
            已审核: "#00A870",
          }[item.auditStateName] || "";
      });
    },
  },
};
</script>
<style lang="scss" scoped>
.print-wrap {
  position: fixed;
  width: 100vw;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: -999;
  opacity: 0;
}
</style>
